<template>
  <Select v-model="value" :placeholder="placeholder"
          @on-change="selectDict">
    <Option v-for="item in dictList"
            :value="item.value"
            :key="item.value">{{ item.name }}</Option>
  </Select>
</template>

<script>
import { getDictByCode } from '../../apis/system/dict';

export default {
  name: 'dictSelector',
  props: {
    value: String,
    code: {
      type: String,
      required: true
    },
    placeholder: String
  },
  data() {
    return {
      typeCode: this.code,
      dictList: [],
    };
  },
  created() {
    this.init();
  },
  methods: {
    init() {
      getDictByCode(this.typeCode, (responseData) => {
        this.dictList = responseData;
      });
    },
    selectDict(value) {
      this.$emit('input', value);
      this.$emit('change', value);
    },
  },
  watch: {
    code(val) {
      this.typeCode = val;
      this.init();
    }
  }
};
</script>

<style scoped>

</style>
